<template>
  <div class="height100 flex flex_d bg_fff" :class="is_close?'close_nav':''">
    <!-- <div class="common_tt flex_ac" v-if="id">
      <a href="javascript:;" @click="$router.go(-1)" class="back"><img src="@/assets/back.png" alt=""></a>
      <div class="title pad_lr20">烟草公司题库1</div>
    </div> -->
    <div class="flex1 flex">
      <!-- <div class="pro_nav height100"  v-if="id">
        <Pronav2 />
        <img src="@/assets/close.png" @click="is_close=!is_close" class="close" alt="">
      </div> -->
      <div class="flex1 page_div">
        <el-scrollbar class="page_div_scroll">
          <div class="f16 pad_t20"  v-if="id"><span class="color">题库模板</span> / 编辑题库信息</div>
          <div class="f24 pad_t20">{{id?'编辑题库信息':'创建题库'}}</div>
          <div style="color: #A6A8B2;" class="pad_tb10 f14">请设置具体题库规则</div>
          <div class="pad_t10"><b>基本信息</b></div>
          <el-form ref="form" :model="form" :rules="rules" label-position="top" v-loading="loading" style="width: 1000px;" class="pad_tb20 clearfix">

            <div class="clearfix flex_ac">
              <FormItem class="margin_r20" style="width: 770px;" maxlength="50" label="题库标题" type="input" :form="form" prop="title"  />
            </div>
            <div class="clearfix" style="width: 770px;">
              <el-form-item label="题库介绍" prop="content">
                <editor ref="ue" :content="form.content" />
              </el-form-item>
            </div>

          </el-form>
          <div style="padding-bottom: 60px;"></div>
        </el-scrollbar>

      </div>
    </div>

    <div class="fixed_submit_btn flex_ac_jc">
      <el-button type="primary" :loading="is_ajax" style="width: 100px;" @click="submitForm('form')">保存</el-button>
      <el-button style="width: 100px;" @click="$router.go(-1);">取消</el-button>
    </div>
  </div>
</template>

<script>
import Editor from '@/components/BdEditor';
export default {
  name: 'projectAdd',
  components: {Editor},
  data () {
    return {
      is_ajax:false,
      loading:false,
      is_close:false,
      value:'',
      id:'',
      form: {},
      // 表单校验
      rules: {
        content: [
          { required: true, message: "题库介绍不能为空", trigger: "blur" }
        ],
        title: [
          { required: true, message: "题库标题不能为空", trigger: "blur" }
        ]
      },
      openOptions: [{label:'当前页面打开',value:0},{label:'新页面打开',value:1}]
    }
  },
  watch:{
    '$route'(to, from){
      if(to.path=='/answer/addanswer'){
        this.init()
      }
    }
  },
  mounted() {
    this.init()
  },
  methods:{
    get_data(){
      let _data=window.edit_answer;
      _data.content=this.add_upload_http(_data.content || '');
      this.form=_data
    },
    init(){
      this.id=this.$route.query.id || '';
      this.form={

      }
      this.resetForm('form')
      if(this.id){
        this.get_data()
      }
    },
    submitForm(formName) {
      const _this=this;
      _this.form.content=_this.remove_upload_http(_this.$refs.ue.get_content() || '');
      this.$refs[formName].validate((valid) => {
        if (valid) {
          _this.is_ajax=true;
          let _data={..._this.form}
          if(_this.id){
            _data.id=_this.id;
          }
          _this.axios.post("/api/QuestionnaireVersion/add_questionnaire", _data).then(function(data) {
            if(data){
              _this.tip_show('操作成功','success');
              _this.$router.go(-1)
            }
            _this.is_ajax=false;
          }).catch(function(error) {
            _this.is_ajax=false
            console.log(error);
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.no_model{font-size: 13px; color: #A6A8B2; line-height: 20px; padding-top: 4px;}
.add_sh{width: 37.5%;border-radius: 4px;border: 1px dashed #DCDFE6;background: #F4F7FA; height: 40px;line-height: 40px;}
.add_sh.add_sh2{border: 1px solid #DCDFE6; width: 100%; color: #828696; padding: 0 12px; cursor: default;}
.add_sh img{display: block; margin-right: 10px;}
.del_sh{float: left; margin-top: 20px;}

.ym_img{height: 205px; background: #F4F7FA; border-radius: 4px;}
</style>
